define([
	'../api',
	'../index',
    'text!./index.html',
    'css!./index.css',
	'../selected/index'
], function(api,ohcard, html,css,
	OhcardSelected,
) {
    return {
		components: {
			'ohcard-selected': OhcardSelected,
		},
		props: {
			room:{
				type:Object,
				default:{
					id:0,
					is_adult:0,
				},
			}
		},
        data: function () {
			return {
				selected:[],
				selectedIds: [],
				chooseIndex: null,
				chooseImage: {},
				chooseSort: null,
				sort: {},
				sortIds: {},
			}
        },
		watch:{
			sort:{
				deep:true,
				handler(n,o){
					this.sortIds = {};
					let vm = this;
					for (let key in this.sort) {
						this.sortIds[key] = this.sort[key].id
					}
				}
			}
		},
		created:function(){
			this.sortIds = this.room.cards_id == 'null' ? {} : JSON.parse(this.room.cards_id);
			this.getSelected();
			this.getSort();
		},
		methods:{
			getSelected: function(){
				api.getCards({ids:this.room.choose_id})
				.then((res) => {
					this.selected = res.data;
				})
			},
			getSort: function(){
				let ids = Object.values(this.sortIds);
				if(ids.length>0){
					api.getCards({ids:ids})
					.then((res) => {
						res.data.forEach((image,index)=>{
							let sort = this.getImageSortById(image.id);
							this.sort[sort] = image;
						})
					})
				}
			},
			getImageSortById: function(card_id){
				let sort = -1;
				const valIndex = Object.values(this.sortIds).indexOf(card_id);
				if(valIndex >= 0) sort = Object.keys(this.sortIds)[valIndex];
				return sort;
			},
			getSrc: function(index){
				if(this.sort[index]) return this.sort[index].image;
			},
			chooseHandler: function(index){
				this.chooseIndex = index;
				this.chooseImage = this.selected[index];
				this.setSort();
			},
			setChooseSort: function(index){
				this.chooseSort = index;
				this.setSort();
			},
			setSort: function(){
				if(this.chooseIndex!=null && this.chooseSort!=null){
					// 重复排序
					const sort = this.getImageSortById(this.chooseImage.id);
					if(sort >= 0) delete this.sort[sort];
					// 设置排序数组
					this.sort[this.chooseSort] = this.chooseImage
					// 重置选中图片和序号
					this.chooseIndex=null;
					this.chooseSort=null;
					// 保存排序
					let vm = this;
					this.$nextTick(()=>{
						let sort = JSON.stringify(vm.sortIds);
						this.room.cards_id = sort;
						api.identifySort(this.room.id,sort);
					})
				}
			},
			imgBoxOn: function(index){
				return this.chooseSort == index;
			},
			imgIsShow: function(index){
				return this.sort[index] != undefined;
			},
			nextHandler:function(){
				if(Object.values(this.sort).length<10){
					Layer.alert('请完成排序后再进入下一步', {title: false, icon: 2});
					return false;
				}
				api.setStep(this.room.id,3)
				.then((res)=>{
					this.room.step = 3
				})
				.catch((err)=>{Layer.alert(err.msg, {title: false, icon: 2});})
			}
		},
        template: html
    };
});